{% extends 'sales/base.html' %}
{% load static %}
{% load paginate %}
{% load thumbnail %}
{% block content %}


<div class="main_container">
  <div class="row marl">
    <div class="col-lg-12 text-right">
      <span class="d-inline"><a href="{% url 'marketing:add_email_for_campaigns' %}" class="btn primary_btn"><i
            class="fa fa-plus"></i> Contacts</a></span>
      
    </div>
  </div>
  

  
  <div class="filter_row list_filter_row_contacts row marl">
    <div class="col-md-12">
      <div class="card">
        <div class="card-body">
          <form id="contacts_filter" method="POST" action="" class="filter_form">
            <div class="card-body">
              <div class="card-title">Filter Contacts</div>
              <div class="row marl">
                
                <div class="filter_col col-md-2">
                  <div class="form-group">
                    <label for="exampleInputEmail1">Email</label>
                    <input type="text" class="form-control" name="domain" value="{{request.POST.domain}}">
                  </div>
                </div>
                
                <input type="hidden" name="tab_status" id="tab_status">
                <input type="hidden" name="filter_contacts" id="tab_status" value="filter_contacts">
                <div class="filter_col col-lg-2">
                  <div class="form-group buttons_row">
                    <button class="btn btn-primary save" type="submit">Search</button>
                    <a href="" class="btn btn-default clear" >Clear</a>
                  </div>
                </div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
  

  


  <div class="filter_row row marl">
    <div class="col-md-12 col-lg-12 col-xl-12">
      <div class="table_container_row row marl no-gutters">
        <div class="col-md-12">
          
          <div class="tab-content" id="myTabContent">
            <div class="tab-pane fade  show active" id="open" role="tabpanel" aria-labelledby="open">
              <div class="card">
                <div class="card-body">
                  <div class="card-title text-right">
                    <span class="float-left">Blocked Domain - {% if show_pageitems %}
                      {% show_pageitems %}{% else %}
                      {{ blocked_domains|length }}{% endif %}</span>
                    <span class="filter_toggle_contacts">
                      <a href="#" class="primary_btn"><i class="fas fa-filter"></i></a>
                    </span>
                  </div>
                  <div class="table-responsive">
                    <table class="table ">
                      <thead>
                        {% if blocked_domains|length > 0 %}
                        <tr>
                          <th width="5%">ID</th>
                          <th width="15%">Domain</th>
                          <th width="15%">Created by</th>
                          <th width="15%">Created On</th>
                          <th width="10%">Actions</th>
                        </tr>
                        {% endif %}
                      </thead>
                      <tbody>
                        {% if per_page %}
                        {% paginate per_page blocked_domains %}
                        {% else %}
                        {% paginate 10 blocked_domains %}
                        {% endif %}
                        {% for domain in blocked_domains %}
                        <tr class="text-center">
                          <td scope="row">{{ forloop.counter }}</td>
                          <td>{{ domain.domain }}</td>
                          <td>
                            {% if domain.created_by %}
                            {% if domain.created_by.profile_pic %}
                            {% thumbnail domain.created_by.profile_pic "40x40" crop="center" as im %}
                            <img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"
                              title="{{ domain.created_by }}" style="border-radius: 50%" />
                            {% endthumbnail %}
                            {% else %}
                            <img src="{% static 'images/user.png' %}"
                              style="width: 40px;height: 40px;border-radius: 50%;" title="{{ domain.created_by }}" />
                            {% endif %}
                            {% else %}
                            <img src="{% static 'images/user.png' %}"
                              style="width: 40px;height: 40px;border-radius: 50%;" title="{{ domain.created_by }}" />
                            {% endif %}
                          </td>
                          <td title="{{ domain.created_on }}">{{ domain.created_on_arrow }}</td>
                          <td class="actions">
                            {% if request.user.role == 'ADMIN' or reques.user.is_superuser %}
                            <a href="{% url 'marketing:edit_blocked_domain' domain.id %}"
                              class="btn btn-success edit" title="Edit"><i class="fas fa-pencil-alt"></i></a>
                            <a href="{% url 'marketing:delete_blocked_domain' domain.id %}"
                              class="btn btn-danger delete remove_document" title="Delete"><i class="fas fa-trash-alt"></i></a>
                            {% endif %}
                          </td>
                        </tr>
                        {% endfor %}
                      </tbody>
                    </table>
                  </div>
                  {%ifequal blocked_domains|length 0%}
                  <h6 class="text-center">No Domains Found</h6>
                  {%endifequal%}
                  <div class="marl row text-center">
                    {% show_pages %}
                  </div>
                </div>
              </div>
            </div>
          </div>
          <br clear="all">
        </div>
      </div>
    </div>
  </div>

</div>

{% endblock %}
{% block js_block %}
<script type="text/javascript">
  $('.trash').click(function (e) {
    e.preventDefault()
    url = $(this).attr('href')
    if (!confirm('Are you sure you want to delete?'))
      return;
    window.location = $(this).attr('href')
  });
  $('.assigned_users').select2();
  $(".list_filter_row_contacts").hide()
  $(".filter_toggle").click(function () {
    $(".list_filter_row").toggle();
    $(".list_filter_row_contacts").hide();
  });
  $(".filter_toggle_contacts").click(function () {
    $(".list_filter_row_contacts").toggle();
    $(".list_filter_row").hide();

  });

  $("#close a[rel='page']").click(function (e) {
    e.preventDefault();
    $('#settings_filter').attr("action", $(this).attr("href"));
    $('#settings_filter').submit();
  });

  $("#open a[rel='page']").click(function (e) {
    e.preventDefault();
    $('#contacts_filter').attr("action", $(this).attr("href"));
    $('#contacts_filter').submit();
  });
</script>
{% endblock js_block %}